popstate = 0;
saveheight = 0;
savewidth = 0;
savepos = {};
function fix_dimensions(elem) {
    //p=elem.position();
    elem.css( { width  : elem.width(),
		height : elem.height() });
}
function unfix_dimensions(elem) {
    elem.css( { width  : 'auto',
		height : 'auto' } );
}
function fixpos(elem,pos) {
    if(typeof(pos)==='undefined') pos = 'absolute';
    o = $(elem).offset();
    sp = {
	top      : $(elem).css('top'),
	left     : $(elem).css('left'),
	position : $(elem).css('position')
    };
    savepos[elem.id] = sp;
    $(elem).css({ top: o.top,
		  left: o.left,
		  position: pos });
}
function unfixpos(elem) {
    sp = savepos[elem.id];
    $(elem).css( { top: sp.top,
		   left: sp.left,
		   position: sp.position 
		 });
}
function to_pix(dim) {
    if( dim.match('px') ) {
	return dim.replace('px','');
    }
}
function resize_slides(container) {
    slides = $('.slide');
    w = container.innerWidth();
    w = w - to_pix(container.css('padding-left'))
	- to_pix(container.css('padding-right'))
	- to_pix( $(slides[0]).css('border-left-width'))
	- to_pix( $(slides[0]).css('border-right-width'));
    slides.each( function(ix,slide) {
	$(slide).css('width',w);
    } );
}
$(document).ready(function() {
    pdiv = $("#pop");
    podiv = $('#pop_outer');
    shad = $("#shadow");
    slides = $("#slides");
    nav_btns = $('#slides a.nxtprv');
    container = $('.slides_container');
    pdiv_popout_sty = {
	width: '96%',
	//height: '85%',
	top: '5%',
	left: '2%'
    };
    unfix_navs = function() {
	//nav_btns.each( function(i,el) { unfixpos(el) } );
    };
    fix_navs = function() {
	//nav_btns.each( function(i,el) { fixpos(el) } );
    };
    resize_slides(container);
    $("#popbutton").click(function(event){
	dur = 400;
	if( popstate ) {  
	    popstate = 0;
	    unfix_navs();
	    unfix_dimensions(container);
	    shad.fadeOut(dur);
	    fixpos(pdiv);
	    pdiv.animate( {
		width: savewidth,
		height: saveheight,
		left: savepos.left,
		top: savepos.top
	    }, dur, function() {
		pdiv.detach();
		podiv.prepend(pdiv);	    

		pdiv.css('position','static');
		pdiv.removeClass('popped_out');
		pdiv.addClass('popped_in');
		resize_slides(container);
	    });
	} else {
	    fix_dimensions(podiv);
	    shad.fadeIn(dur);
	    savewidth = pdiv.css('width');
	    saveheight = pdiv.css('height');
	    fix_dimensions(pdiv);
	    fixpos(pdiv);
	    pdiv.detach();
	    $('body').prepend(pdiv);
	    //pdiv.css('position','absolute');
	    savepos = pdiv.position();
	    //alert( pdiv.css('position') );
	    //pdiv.css('position','fixed');
	    popstate = 1;
	    pdiv.animate( pdiv_popout_sty, dur, function() {

		fix_dimensions(container);
		fix_navs();
		pdiv.removeClass('popped_in');
		pdiv.addClass('popped_out');
		resize_slides(container);
	    });
	}
    });
    $(window).resize(function() {
	if( popstate ) {
	    unfix_dimensions(container);
	    unfix_navs();
	    pdiv.css( pdiv_popout_sty );
	    fix_dimensions(container);
	    fix_navs();
	}
	resize_slides(container);
    });

});

    